import { RefObject, cloneElement, useCallback, useEffect, useRef, useState } from "react";


export default function useScrolling(ref: RefObject<HTMLElement>): boolean {
    const [scrolling, setScrolling] = useState(false);

    useEffect(() => {
      if (ref.current) {
        let scrollTimer: NodeJS.Timeout
        const handleScrollEnd = () => {
          setScrolling(false)
        }
        const handleScroll = () => {
          setScrolling(true)
          clearTimeout(scrollTimer)
          scrollTimer = setTimeout(() => handleScrollEnd(), 150);
        }
        ref.current.addEventListener('scroll', handleScroll)
        return () => {
          if (ref.current) {
            ref.current.removeEventListener('scroll', handleScroll)
          }
        };
      }
      
    }, [ref]);


    return scrolling
}